<template>
    <div>
        <n-space>
            <div class="input-div">
            <n-input placeholder="输入激活密钥" v-model:value="passKey" @keydown.enter="handleClick">
                <template #prefix>
                    <n-icon>
                        <user-secret></user-secret>
                    </n-icon>
                </template>
            </n-input>
        </div>
        <div class="input-div">
            <n-button size="medium" type="info" @click="handleClick">验证</n-button>
        </div>
        </n-space>
    </div>
</template>

<script setup>
import { ref } from "vue";
import { useMainStore } from "../store/index";
import { NInput, NIcon, NSpace, NButton, useNotification } from "naive-ui";
import { UserSecret } from "@vicons/fa";

let passKey = ref("");

let mainStore = useMainStore();
let notification = useNotification();

function handleClick() {
    if (mainStore.isPassed(passKey.value)) {
        notification["success"]({
            content : "密钥验证",
            meta : "成功!",
            duration : 4000
        })
    } else {
        notification["error"]({
            content : "密钥验证",
            meta : "失败!",
            duration : 4000
        })
    }
}

</script>

<style scoped>
.input-div {
    padding : 16px;
}
</style>